<template>

	<!-- 登录title -->
	<view class="logintitle">
		<image class="logintitle-img" src="../../static/登录背景.png"></image>

		<view class="login-textbox" @click="gotoIndex">
			<image class="login-titlebox-img" src="../../static/上一步.png"></image>
			<view class="login-textbox-backtext" >返回</view>
		</view>
	</view>
	<!-- middle部分 -->
	<view class="login-middle">
		<view class="login-middlebox">
			<image class="login-middlebox-img" src="../../static/登录图片.png"></image>
			<view class="login-middlebox-text">尽享购物乐趣，轻松选购全新好物</view>
		</view>
	</view>
	<!-- 登录部分 -->
	<view class="buttonbox">
		<view class="loginbutton">
			<image class="loginbutton-img" src="../../static/weixin.png"></image>
			<view class="loginbutton-text">微信登录</view>
		</view>

		<view class="loginbutton2">
			<image class="loginbutton-img" src="../../static/手机.png"></image>
			<view class="loginbutton-text">手机登录</view>
		</view>
	</view>


	<view class="tips">
		<text class="tips-text1">登录即代表你同意</text>
		<text class="tips-text2">《隐私政策》</text>
		<text class="tips-text1">和</text>
		<text class="tips-text2">《服务协议》</text>
	</view>


</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			gotoIndex() {
				// 在tabbar中使用uniapp的switchTab方法跳转
				uni.switchTab({
					url: '/pages/index/index', // 我的路径
				});
			},
		}
	}
</script>

<style>
	page {
		background: #f6f6f6;
	}

	/* 登录title */
	.logintitle {}

	.logintitle-img {
		width: 100%;
		height: 30vh;
		opacity: 0.4;
	}

	.login-textbox {
		display: flex;
		align-items: center;
		position: absolute;
		top: 10px;
		left: 10px;
	}

	.login-titlebox-img {
		width: 15px;
		height: 15px;
		margin-right: 5px;

	}

	.login-textbox-backtext {
		font-size: 15px;
	}

	/* mideele box */
	.login-middle {}

	.login-middlebox {
		margin-bottom: 20px;
	}

	.login-middlebox-img {
		display: block;
		width: 100px;
		height: 100px;
		margin: 0 auto;
		border-radius: 30px;
		margin-bottom: 10px;
	}

	.login-middlebox-text {
		font-size: 13px;
		text-align: center;
	}

	/* 登录部分 */
	.buttonbox {}

	.loginbutton {
		display: flex;
		align-items: center;
		padding: 2%;
		border-radius: 20px;
		justify-content: center;
		background: yellow;
		width: 80%;
		margin: 0 auto 10px;

	}

	.loginbutton-img {
		width: 20px;
		height: 20px;
		align-items: center;
	}

	.loginbutton2 {
		display: flex;
		align-items: center;
		padding: 2%;
		border-radius: 20px;
		justify-content: center;
		width: 80%;
		margin: 0 auto;
		background: #eee;
	}

	.tips {
		font-size: 13px;
		text-align: center;
		position: absolute;
		bottom: 20px;
		width: 100%;
	}

	.tips-text1 {
		color: rgb(120, 120, 120);
	}

	.tips-text2 {}
</style>
